<template>
  <div>
    <div class="content_c" v-for="(item, index) in list" :key="index">
      <!-- 内容3 -->
      <div class="items">
        <div class="items-left">
          <img
            class="item_title"
            src="../../static/images/examine/name.png"
            alt=""
          />
          <span>活动名称</span>
        </div>
        <div class="items-right moveOverflow">
          {{ item.activity_name }}
        </div>
      </div>
      <!-- 内容5 -->
      <div class="items">
        <div class="items-left">
          <img
            class="item_title"
            src="../../static/images/examine/brand.png"
            alt=""
          />
          <span>品鉴品牌</span>
        </div>
        <div class="items-right">{{ item.brand_name }}</div>
      </div>
      <!-- 内容5 -->
      <div class="items">
        <div class="items-left">
          <img
            class="item_title"
            src="../../static/images/examine/name.png"
            alt=""
          />
          <span>商品名称</span>
        </div>
        <div class="items-right">{{ item.product_name }}</div>
      </div>
      <!-- 内容4 -->
      <div class="items">
        <div class="items-left">
          <img
            class="item_title"
            src="../../static/images/examine/item_time.png"
            alt=""
          />
          <span>品鉴时间</span>
        </div>
        <div class="items-right moveOverflow">
          {{ item.tasting_start_time }}
        </div>
      </div>

      <div class="items">
        <div class="items-left">
          <img
            class="item_title"
            src="../../static/images/examine/item_address.png"
            alt=""
          />
          <span>品鉴地点</span>
        </div>
        <div class="items-right moveOverflow">
          {{ item.tasting_address }}
        </div>
      </div>
      <div class="items">
        <div class="items-left">
          <img
            class="item_title"
            src="../../static/images/examine/onepre.png"
            alt=""
          />
          <span>报名人员</span>
        </div>
        <div class="items-right moveOverflow">
          {{ item.user_name }}
        </div>
      </div>
      <div class="items">
        <div class="items-left">
          <img
            class="item_title"
            src="../../static/images/examine/p1.png"
            alt=""
          />
          <span>报名手机号</span>
        </div>
        <div class="items-right moveOverflow">
          {{ item.mobile }}
        </div>
      </div>
      <div class="items">
        <div class="items-left">
          <img
            class="item_title"
            src="../../static/images/examine/item_num.png"
            alt=""
          />
          <span>参加人数</span>
        </div>
        <div class="items-right moveOverflow">
          {{ item.participants_num }}
        </div>
      </div>

      <div class="items">
        <div class="items-left">
          <img
            class="item_title"
            src="../../static/images/examine/item_sign_title.png"
            alt=""
          />
          <span>报名时间</span>
        </div>
        <div class="items-right moveOverflow">
          {{ item.create_time }}
        </div>
      </div>

      <div class="actCont">
        <div class="actOne" @click="goAddCompany(item)">参加人员</div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    list: {
      type: Array,
    },
  },
  data() {
    return {};
  },
  methods: {
    goAddCompany(item) {
      wx.navigateTo({
        url: `/pages/my/customer/record/main?apply_id=${item.apply_id}`,
      });
    },
    //点击图片查看
    handleImgs(current) {
      wx.previewImage({
        current, // 当前显示图片的http链接
        urls: [current], // 需要预览的图片http链接列表
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.content_c {
  width: 630rpx;
  padding: 40rpx;
  padding-bottom: 10rpx;
  background: #fff;
  border-radius: 20rpx;
  margin: 0rpx auto 30rpx auto;
  .actCont {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    border-top: 1rpx solid #e3e3e3;

    padding-top: 30rpx;
    margin-bottom: 30rpx;
    .actOne {
      width: 142rpx;
      height: 60rpx;
      background: #fb1821;
      border-radius: 60rpx;
      font-family: "PingFang SC";
      font-style: normal;
      font-weight: 400;
      font-size: 24rpx;
      /* or 175% */
      color: #ffffff;
      text-align: center;
      line-height: 60rpx;
    }
  }
  .items {
    margin-bottom: 30rpx;
    display: flex;
    // justify-content: space-between;
    align-items: flex-start;
    font-size: 28rpx;
    .items-left {
      flex: 1;
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-right: 30rpx;

      .item_title {
        width: 28rpx;
        height: 28rpx;
        margin-right: 10rpx;
      }
      span {
        flex: 1;
        color: #333333;
      }
    }
    .items-right {
      width: 368rpx;
    }
  }
}
</style>